<!--
 * @Description: In User Settings Edit
 * @Author: your name
 * @Date: 2019-06-08 07:51:53
 * @LastEditTime: 2019-11-21 11:38:20
 * @LastEditors: Please set LastEditors
 -->
<template>
  <view class="person-info-page">
    <view class="person-item">
      <view class="person-header">
          <image
            :src="hostIp+PersonInfo.workImage"
            mode="aspectFill"
            lazy-load="false">
         </image>
      </view>
      <view class="person-info">
        <view class="person-job" v-if="type==0">
          <view class="person-name">{{PersonInfo.realName}}</view>
          <view class="person-time">咨询时间：{{PersonInfo.creationTime}}</view>
        </view> 
         <view class="person-job-type" v-else>
          <view class="person-name">{{PersonInfo.realName}}</view>
          <view class="person-time">已有{{PersonInfo.fwrs+539}}人咨询</view>
        </view> 
        <view class="person-skilled">擅长服务：{{PersonInfo.hobby}}</view>
        <view class="person-source" >
          <view class="text">{{PersonInfo.workCompany}}</view>
          <view class="btn" v-if="type==0">
             <view class="assess-btn" @click.stop="assessFn"  :data-cid="PersonInfo.cid">立即评价</view>
          </view>
           <view class="btn"  v-else>
             <view class="assess-btn" 
              @click.stop="onLineFn"     
              :data-url="'chat'"
              :data-id="PersonInfo.cid"
              :data-link="PersonInfo.link"
              :data-image="PersonInfo.workImage"
              :data-uid="PersonInfo.uid">在线咨询</view>
              <view class="phone-btn" @click.stop="callPhone" :data-number="PersonInfo.cmobile"  :data-id="PersonInfo.cid">电话咨询</view>
          </view>
        </view>
      
      </view>
    </view>
  </view>
</template>
<script>
import Vue from "vue";
import InterServer from "@/common/config/server";
import { isLogin } from "@/common/utils/util";
import {localStorageSyncServer} from "@/common/js/common"
export default {
  props:["PersonInfo",'type'],
  data() {
   let hostIp=Vue.globalData.hostIp
    return {
      hostIp,
      phoneNumber:"",
    };
  },
   props: {
        PersonInfo: {
            type: Object,
            default: function() {
                return {};
            }
        },
        type: {
            type: Number,
            default: 0
        },

   },
  created(){
  },
  methods: {
    //标签切换
    chooseTag(e) {
      this.tagActive = e.currentTarget.dataset.id;
    },
    //页面跳转
    navigateUrl() {
      let url = `./consultantDetails`;
      Vue.customNavigateTo(url);
    },
    //立即评价按钮
    assessFn(e){
       this.$emit('assessFn',e);
    },
    //在线咨询按钮
    onLineFn(e) {
      isLogin().then(res => {
        if (res) {
          const dataset = e.currentTarget.dataset;
          let [url,image, id,uid] = [dataset.url, dataset.image, dataset.id,dataset.uid];
          localStorageSyncServer.set("herderRobotImg",this.image)
            InterServer.advisoryRecord({
              cid: id,
              type: 1 //0快捷电话 1图文咨询
            }).then(res => {
              Vue.customNavigateTo(`${url}?id=${uid}`);
            });
              this.advisoryRecord(id,1,url,uid);
        }
      });
    },
     //电话咨询按钮
    callPhone(e) {
      isLogin().then(res => {
        if(res){
          const dataset = e.currentTarget.dataset;
          let [phoneNumber, id] = [dataset.number, dataset.id];
          this.phoneNumber=phoneNumber;
          this.advisoryRecord(id,0);
        }
      });
    },
     //快捷电话和图文咨询记录
    advisoryRecord(id,type,url,uid) {
      let _that=this;
      if (id) {
        InterServer.advisoryRecord({
          cid: id,
          type: type //0快捷电话 1图文咨询
        }).then(res => {
          console.log(res);
          if(res.code==200){
            if(type==0){
                uni.makePhoneCall({
                    phoneNumber: _that.phoneNumber
                });
            }else{
              Vue.customNavigateTo(`${url}?id=${uid}`);
            }
          }
        });
      }

    }
  }
};
</script>

<style lang="less" scoped>
.person-info-page {
    .person {
      &-item {
        display: flex;
        padding: 16upx 40upx 20upx 24upx;
        box-shadow:0px 2px 4px rgba(0,0,0,0.16);
      }
      &-header {
        margin-right: 25upx;
        image {
          width: 97upx;
          height: 146upx;
        }
      }
      &-info {
        font-size: 24upx;
         width: 100%;
      }
      &-job {
        width: 100%;
        display: flex;
        color: #333333;
        font-weight: bold;
        font-size: 30upx;
        margin-top: 7upx;
       justify-content: space-between;
        align-items: center;
      }
        &-job-type {
        width: 100%;
        display: flex;
        color: #333333;
        font-weight: bold;
        font-size: 30upx;
        margin-top: 7upx;
       justify-content: space-between;
        align-items: center;
        border-bottom:1upx solid rgba(206,204,204,1);
      }
      &-name {
        font-size:28upx;
         font-family:PingFang-Semibold;
        font-weight:bold;
        line-height:40upx;
        color:rgba(51,51,51,1);
      }
      &-time{
        font-size:22upx;
        font-family:PingFang-Semibold;
        font-weight:bold;
         line-height:36upx;
        color:rgba(102,102,102,1);
      }
      &-source {
        border-radius: 5upx;
        margin: 25upx 0 15upx;
        display: flex;
        flex-wrap: wrap;
        display: flex;
        align-items: center;
        justify-content: space-between;
        .text{ 
          font-size:22upx;
           font-family:PingFang-Semibold;
          font-weight:bold;
          line-height:44upx;
          color:rgba(2,89,255,1);
          margin-top: 14upx;

        }
        .btn{
          display: flex;
          .assess-btn{
            width:160upx;
            height:44upx;
            background:linear-gradient(180deg,rgba(245,195,95,1) 0%,rgba(255,119,0,1) 100%);
            box-shadow:2upx 2upx 2upx rgba(254,202,82,0.64);
            border-radius:22upx;
            text-align: center;
            line-height: 44upx;
            font-size:28upx;
            font-family:PingFang-Semibold;
            font-weight:bold;
            color: #ffffff;
            text-align: center;
          }
          .phone-btn{
            width:160upx;
            height:44upx;
            background:rgba(255,255,255,1);
            border:1px solid rgba(0,136,255,0.27);
            box-shadow:2px 2px 2px rgba(0,136,255,0.27);
            border-radius:22upx;
            text-align: center;
            line-height: 44upx;
            font-size:28upx;
            font-family:PingFang-Semibold;
            font-weight:bold;
            color:rgba(2,89,255,1);
            text-align: center;
            margin-left: 20upx;
          }
        }
      }
      &-skilled {
        font-size:24upx;
        width: 376upx;
        overflow: hidden;
        text-overflow:ellipsis;
        white-space: nowrap;
        font-family:PingFang-Semibold;
        font-weight:bold;
        line-height:33upx;
        color:rgba(153,153,153,1);
        margin: 4upx 0 25upx;
      }
    }
}
</style>
